* {
  box-sizing: border-box;
}
@font-face {
  font-family: 'thaisanslite_r1';
  src: url('font/thaisanslite_r1.woff2') format('woff2'),
       url('font/thaisanslite_r1.woff') format('woff'),
       url('font/thaisanslite_r1.ttf')  format('truetype');
}
body{
    text-align :center;
    background-color : rgb(148, 16, 16);
    font-family: 'thaisanslite_r1', sans-serif;
  }
  .textbox {
    border : 3px solid  #ffffff;
    height : 50px;
    border-radius: 10px 10px 10px 10px;
    font-size : 25pt;
    width : 100%;
    margin-top : 10px;
    box-shadow: -5px 11px 42px 11px rgba(0, 0, 0, 0.35);
  -webkit-box-shadow: -5px 11px 42px 11px rgba(255,9,9,0.35);
  -moz-box-shadow: -5px 11px 42px 11px rgba(255,9,9,0.35);
  }
  .textbox:focus {
    box-shadow: -5px 11px 42px 11px rgba(255,9,9,0.35) inset;
  -webkit-box-shadow: -5px 11px 42px 11px rgba(255,9,9,0.35) inset;
  -moz-box-shadow: -5px 11px 42px 11px rgba(255,9,9,0.35) inset;
  }
  .click {
    height : 60px;
    font-size : 25pt;
    border : 3px solid #ffffff;
    border-radius : 10px 10px 10px 10px;
    margin-top: 10px;
    background-color : #a33434;
    color : #000000;
  }
  .fulllogo{
   height:30%;
   width:30%;
   float:left;
  }
  .click:hover{
    background-color : red;
    color : #E97171;
    box-shadow: -8px 2px 53px 0px rgba(185, 29, 29, 0.55);
  -webkit-box-shadow: -8px 2px 53px 0px rgba(244,0,0,0.55);
  -moz-box-shadow: -8px 2px 53px 0px rgba(244,0,0,0.55);
  }
  .card {
    background-color : rgb(179, 78, 78);
    border-radius : 2px;
    display : inline-block;
    height : 300px;
    margin : 1rem;
    position : relative;
    width: 300px;
    padding: 25px 25px 25px 25px;
  }
  h1,h3 {
    color : #000000;
  }
  .iframe:focus {
    outline: none;
  }
  
  .iframe[seamless] {
    display: block;
  }
  .carousel-item{
    height: 350px;
  }
  .p1{
    list-style:none ;
  }
aside{
text-align:left;
}
.top{
  text-align: left;
}
.top-1{
  text-align: left;

}
.all-browsers {
  margin: 0;
  padding: 5px;
  background-color: rgb(179, 78, 78);
  text-align: left;
}

.all-browsers > h1, .browser {
  margin: 10px;
  padding: 5px;
}

.browser {
  background: white;
}

.browser > h2, p {
  margin: 4px;
  font-size: 90%;
}
.top23{
text-align: left;
}
.card-text{
  color: #ffffff;
}
.text-infoe {
  color: #ffffff;
}
.text-truncate{
  color: #ffffff;
}
.card-title{
  color: #ffffff;
} 
.text-info{
  color: #ffffff;
}
.city {
  
  margin: 10px;
  padding: 10px;
  max-width:100%;
  height: 500px;
}   
@media only screen and (max-width: 480px) {
	.site-title {
    max-width: 480px;
		font-size: 25px;
	}
}
.x {width:300px;height:300px;margin:5px; }
.x1{
  width: 300px; height: 300px; margin: 5px;
  text-align: left;
}
.x2{
  width: 150px; height: 135px; margin: 5px;
}
.x3{
  width: 300px; height: 300px; margin: 5px;
}
.sd{
  left: auto;
  width: 500px; 
  height: 250px;
  margin-left:auto ;
  margin-right: auto;
}
.sd article a figure{
  width: 20%;
  height: 350px;
  float: left;
}
.sd article figure{
  position: relative;
  width: 300%;
  margin: 0px;
  left: 0px;
  animation:krutom 20s infinite linear;
}
@keyframes krutom{
  0%{left: 0%;}
  15%{left: 0%;}
  20%{left: -100%;}
  35%{left: -100%;}
  40%{left: -200%;}
  60%{left: -200%;}
  65%{left: -300%;}
  80%{left: -300%;}
  85%{left: -400%;}
  100%{left:-400%;}
}